import { defineStore } from 'pinia'

// 定义主题配置
const themes = {
	default: {
		// 主题色
		primary: '#007AFF',
		success: '#4cd964',
		warning: '#f0ad4e',
		error: '#dd524d',
		info: '#909399',
		
		// 背景色
		background: '#f8f8f8',
		card: '#ffffff',
		
		// 文字颜色
		text: '#333333',
		'text-inverse': '#ffffff',
		'text-secondary': '#666666',
		'text-disabled': '#999999',
		'text-placeholder': '#999999',
		
		// 边框颜色
		border: '#e5e5e5',
		
		// 导航栏
		navBg: '#ffffff',
		navText: '#000000'
	},
	dark: {
		// 主题色
		primary: '#007AFF',
		success: '#4cd964',
		warning: '#f0ad4e',
		error: '#dd524d',
		info: '#909399',
		
		// 背景色
		background: '#333333',
		card: '#444444',
		
		// 文字颜色
		text: '#ffffff',
		'text-inverse': '#333333',
		'text-secondary': '#cccccc',
		'text-disabled': '#999999',
		'text-placeholder': '#999999',
		
		// 边框颜色
		border: '#555555',
		
		// 导航栏
		navBg: '#333333',
		navText: '#ffffff'
	},
	blue: {
		// 主题色
		primary: '#2196F3',
		success: '#4cd964',
		warning: '#f0ad4e',
		error: '#dd524d',
		info: '#909399',
		
		// 背景色
		background: '#E3F2FD',
		card: '#ffffff',
		
		// 文字颜色
		text: '#1976D2',
		'text-inverse': '#ffffff',
		'text-secondary': '#666666',
		'text-disabled': '#999999',
		'text-placeholder': '#999999',
		
		// 边框颜色
		border: '#e5e5e5',
		
		// 导航栏
		navBg: '#2196F3',
		navText: '#ffffff'
	},
	orange: {
		// 主题色
		primary: '#FF9800',
		success: '#4cd964',
		warning: '#f0ad4e',
		error: '#dd524d',
		info: '#909399',
		
		// 背景色
		background: '#FFF3E0',
		card: '#ffffff',
		
		// 文字颜色
		text: '#E65100',
		'text-inverse': '#ffffff',
		'text-secondary': '#666666',
		'text-disabled': '#999999',
		'text-placeholder': '#999999',
		
		// 边框颜色
		border: '#e5e5e5',
		
		// 导航栏
		navBg: '#FF9800',
		navText: '#ffffff'
	},
	purple: {
		// 主题色
		primary: '#9C27B0',
		success: '#4cd964',
		warning: '#f0ad4e',
		error: '#dd524d',
		info: '#909399',
		
		// 背景色
		background: '#F3E5F5',
		card: '#ffffff',
		
		// 文字颜色
		text: '#7B1FA2',
		'text-inverse': '#ffffff',
		'text-secondary': '#666666',
		'text-disabled': '#999999',
		'text-placeholder': '#999999',
		
		// 边框颜色
		border: '#e5e5e5',
		
		// 导航栏
		navBg: '#9C27B0',
		navText: '#ffffff'
	}
}

export const useThemeStore = defineStore('theme', {
	state: () => ({
		theme: uni.getStorageSync('theme') || 'default'
	}),
	
	getters: {
		currentTheme: (state) => themes[state.theme]
	},
	
	actions: {
		setTheme(theme) {
			this.theme = theme
			uni.setStorageSync('theme', theme)
			this.applyTheme()
		},
		
		applyTheme() {
			const theme = this.currentTheme
			
			// 设置导航栏样式
			uni.setNavigationBarColor({
				frontColor: theme.navText,
				backgroundColor: theme.navBg
			})
			
			// 设置状态栏样式
			// #ifdef APP-PLUS
			plus.navigator.setStatusBarStyle(theme.navText === '#ffffff' ? 'light' : 'dark')
			// #endif
			
			// 设置全局主题变量
			// #ifdef H5
			document.documentElement.style.setProperty('--status-bar-color', theme.navText === '#ffffff' ? 'light' : 'dark')
			document.documentElement.style.setProperty('--background-color', theme.background)
			document.documentElement.style.setProperty('--text-color', theme.text)
			document.documentElement.style.setProperty('--card-background', theme.card)
			document.documentElement.style.setProperty('--primary-color', theme.primary)
			document.documentElement.style.setProperty('--success-color', theme.success)
			document.documentElement.style.setProperty('--warning-color', theme.warning)
			document.documentElement.style.setProperty('--error-color', theme.error)
			document.documentElement.style.setProperty('--info-color', theme.info)
			document.documentElement.style.setProperty('--border-color', theme.border)
			document.documentElement.style.setProperty('--text-color-inverse', theme['text-inverse'])
			document.documentElement.style.setProperty('--text-color-secondary', theme['text-secondary'])
			document.documentElement.style.setProperty('--text-color-disabled', theme['text-disabled'])
			document.documentElement.style.setProperty('--text-color-placeholder', theme['text-placeholder'])
			// #endif
			
			// #ifdef MP
			// 小程序环境下，使用 uni.setStorageSync 存储主题变量
			uni.setStorageSync('theme-variables', {
				'--background-color': theme.background,
				'--text-color': theme.text,
				'--card-background': theme.card,
				'--primary-color': theme.primary,
				'--success-color': theme.success,
				'--warning-color': theme.warning,
				'--error-color': theme.error,
				'--info-color': theme.info,
				'--border-color': theme.border,
				'--text-color-inverse': theme['text-inverse'],
				'--text-color-secondary': theme['text-secondary'],
				'--text-color-disabled': theme['text-disabled'],
				'--text-color-placeholder': theme['text-placeholder']
			})
			
			// 更新小程序全局样式
			uni.setStorageSync('theme-style', {
				backgroundColor: theme.background,
				color: theme.text,
				cardBackground: theme.card,
				primaryColor: theme.primary,
				successColor: theme.success,
				warningColor: theme.warning,
				errorColor: theme.error,
				infoColor: theme.info,
				borderColor: theme.border,
				textInverse: theme['text-inverse'],
				textSecondary: theme['text-secondary'],
				textDisabled: theme['text-disabled'],
				textPlaceholder: theme['text-placeholder']
			})
			// #endif
		},
		
		initTheme() {
			this.applyTheme()
		}
	}
}) 